<template>
    <div id="TwoDAnalysis">
         <el-row>
            <el-col :span="12">
                <div align="center">
                    <img src="../../assets/img/叠加分析.png"/><br/>叠加分析
                </div>
            </el-col>
            <el-col :span="12">
                <div align="center">
                    <img src="../../assets/img/缓冲区分析.png"/><br/>缓冲区分析
                </div>
            </el-col>
        </el-row>
          <el-row>
            <el-col :span="12">
                <div align="center">
                    <img src="../../assets/img/空间分析.png"/><br/>空间分析
                </div>
            </el-col>
            <el-col :span="12">
                <div align="center">
                    <img src="../../assets/img/热力图.png"/><br/>热力图
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<script>
  export default {
    data() {
      return {
        activeName: '1',
        value3: true,
        value4: true
      };
    }
  }
</script>

<style>
  #TwoDAnalysis .el-row {
    margin-bottom: 20px;
  }
  #TwoDAnalysis .el-col {
    border-radius: 4px;
  }
  #TwoDAnalysis .bg-purple-dark {
    background: #99a9bf;
  }
  #TwoDAnalysis .bg-purple {
    background: #d3dce6;
  }
  #TwoDAnalysis .bg-purple-light {
    background: #e5e9f2;
  }
  #TwoDAnalysis .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  #TwoDAnalysis .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>

